<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/jsp/common/taglibs.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>订单</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<%@ include file="/jsp/common/commonJs.jsp"%>
</head>
<script>

</script>
<%@ include file="/jsp/head_bus.jsp"%>
<script>
window.onload=function(){
	$("title").html("我的业务");
};
</script>
	<!--内容开始-->
<div class="container">
    <!-- 选项卡组件-->
    <ul id="myTab" class="nav nav-tabs pt30 f17" role="tablist">
        <li class="active"><a href="#order" role="tab" data-toggle="tab">订单管理</a></li>
        <!--<li><a href="#business" role="tab" data-toggle="tab">业务详情</a></li>-->
        <li><a href="${path}/order/business_detail.htm" target="_blank">业务详情</a></li>
    </ul>
    <!-- 选项卡面板 -->
    <div id="myTabContent" class="tab-content pt50">
        <!-- 订单管理 -->
        <div class="tab-pane fade  in active" id="order">
        	<form id="serachForm" method="post"  action="${path}/web/order/orderList.do">
             <div class="c-menu c-menu-2"> 
                <span class="input-group">
                    <label class="fl">订单编号：</label>
                    <input type="text" name="orderNo" id="orderNo" class="form-control  int-110" value="${order.orderNo}" />
                </span>              
                <span class=" input-group input-prepend">
                    <label class="fl">&nbsp;&nbsp;&nbsp;&nbsp;生成日期：</label>
                    <input type="text" name="startDate" id="start_date1" class="Wdate int-110" onClick="WdatePicker({dateFmt:'MM/dd/yyyy'})" value="${startDate}" placeholder="请选择日期"/>
                    <i class="fl">--</i>
                    <input type="text" name="endDate" id="end_date1" class="Wdate int-110 ml101" onClick="WdatePicker({dateFmt:'MM/dd/yyyy'})" value="${endDate}" placeholder="请选择日期"/>
                </span>                  
                <span class="c-menu-r">
                    <label class="fl">订单状态：</label>
                    <select name="orderStatus" id="status" class="form-control-inline select-2">
                        <option value="5" <c:if test="${order.orderStatus==5}">selected</c:if> >全部</option>
                        <option value="0" <c:if test="${order.orderStatus==0}">selected</c:if> >待审核</option>
                        <option value="1" <c:if test="${order.orderStatus==1}">selected</c:if> >待付款</option>
                        <option value="2" <c:if test="${order.orderStatus==2}">selected</c:if> >已付款</option>
                        <option value="3" <c:if test="${order.orderStatus==3}">selected</c:if> >已生效</option>
                        <option value="7" <c:if test="${order.orderStatus==7}">selected</c:if> >已取消</option>
                    </select>               
                </span>
                <button type="submit" class="submit btn btn-100">查询</button>   
            </div>
           </form>
            <div class="c-data mb70">
                <table>
                    <thead>
                        <tr>
                            <th width="20%">订单号</th>
                            <th width="15%">用户名称</th>
                            <th width="20%">生成日期</th>
                            <th width="15%">订单状态</th>
                            <th width="30%">操作</th>
                        </tr>
                    </thead>
                    <tbody>
                    	<c:forEach items="${page.list}" var="order">
	                    	<tr>
	                    		<td>${order.orderNo}</td>
	                    		<td>${order.userName}</td>
	                    		<td><fmt:formatDate value="${order.createTime}" pattern="yyyy-MM-dd HH:mm:ss"/></td>
	                    		<td>
	                    			<c:if test="${order.orderStatus==0}">
	                    				待审核
	                    			</c:if>
	                    			<c:if test="${order.orderStatus==1}">
	                    				待付款
	                    			</c:if>
	                    			<c:if test="${order.orderStatus==2}">
	                    				已付款
	                    			</c:if>
	                    			<c:if test="${order.orderStatus==3}">
	                    				已生效
	                    			</c:if>
	                    			<c:if test="${order.orderStatus==7}">
	                    				已取消
	                    			</c:if>
	                    		</td>
	                    		<td>
	                    			<a href="${path}/web/order/orderdetail.do?orderNo=${order.orderNo}&type=2" target="_blank" class="btn btn-w  btn-t" >详情</a>
	                    			<!-- 新增 -->
	                    			<a href="${path}/web/order/paycycle.do?orderNo=${order.orderNo}" target="_blank" class="btn btn-w  btn-t">付款周期</a>
	                    			<c:if test="${order.orderStatus==0}">
	                    				<button href="###" class="btn btn-w  btn-t" disabled  data-toggle="modal" data-target="#modal-24" data-dismiss="modal" data-backdrop="static">付款</button>
	                    			</c:if>
	                    			<c:if test="${order.orderStatus!=0 && order.orderStatus!=7}">
	                    				<a href="${path}/web/order/orderdetail.do?orderNo=${order.orderNo}&type=1" target="_blank" class="btn btn-w  btn-t" >历史详情</a>
	                    			</c:if>
	                    			<c:if test="${order.orderStatus==1}">
	                    				<button  class="btn btn-w btn-t " onclick="orderId='${order.id}';orderNo='${order.orderNo}';pay_process()">付款</button>
	                    			</c:if>
	                    			 <c:if test="${order.orderStatus==2}">
	                    				<button  class="btn btn-w btn-t" onclick="orderNo='${order.orderNo}';goto_contract('${order.id}')" >签署合同</button>
	                    			</c:if> 
	                    			<c:if test="${order.orderStatus==3}">
	                    				<button  class="btn btn-w btn-t" disabled>已生效</button>
	                    			</c:if>
	                    			<c:if test="${order.orderStatus==7}">
	                    				<button  class="btn btn-w btn-t" disabled>已取消</button>
	                    			</c:if>
	                    			<c:if test="${order.orderStatus==0 || order.orderStatus==1}">
	                    				<a  class="btn btn-w btn-t"  onclick="orderId='${order.id}';orderNo='${order.orderNo}';$('#modal-26').modal('show');">取消</a>
	                    			</c:if>
	                    		</td>
	                    	</tr>
                    	</c:forEach>
                  </tbody>
                </table>
            </div>  
           <script type="text/javascript"> 
                //var ordertype;  //使用全局变量传输订单类型到后台
                var orderId;
                var orderNo;
                function cancleOrder()
                {
            	      $.ajax({
	            		cache: true,
	            		type: "POST",
	            		url:"${path}/web/order/cancleOrder.do",
	           			dataType : 'json',
	           			data:{id:orderId,orderStatus:7},
	           			async: false,
	            		success: function(data)
	            		{
	               			if(data.result)
	               			{
            					 alert("订单取消成功");
            					 window.location.reload();
                    		}
	              			 else
	               			{
	                  			alert("取消订单失败");	
	               			}
	           			}
	        		});
                    }
            	function pay_process()
            	{
            		$.ajax({
	            		cache: true,
	            		type: "POST",
	            		url:"${path}/user/isSetPayPwd.json",
	           			dataType : 'json',
	           			async: false,
	            		success: function(data)
	            		{
	               			if(!data.result)
	               			{
            					// $('#modal-25').modal('show');
            					alert("您未设置支付密码，请点击确定跳转向设置支付密码页面！");
            					window.location.href="${path}/user/setPayPwd.htm";
            					//goto_contract();
                    		}
	              			 else
	               			{
	               				$('#modal-24').modal('show');
	               			}
	           			}
	        		});
            	}
            	function payorder()
            	{
            	      $.ajax({
	            		cache: true,
	            		type: "POST",
	            		url:"${path}/web/order/payOrder.do",
	           			dataType : 'json',
	           			 data:{id:orderId,orderNo:orderNo},
	           			 async: false,
	            		success: function(data)
	            		{
	               			if(data.status)
	               			{
            					//$('#modal-25').modal('show');
            					alert("订单支付成功，谢谢！");
            					window.location.reload();
                    		}
	              			 else
	               			{
	              				 alert(data.balance);
	               			}
	           			}
	        		});
              	
            	}
            	function verify_userinfo()
            	{
            		  
            	      $.ajax({
	            		cache: true,
	            		type: "POST",
	            		url:"${path}/user/verify_userinfo.json",
	           			dataType : 'json',
	           			data:{zhifumima:"df"},	           			
	           			async: false,
	            		success: function(data)
	            		{
	               			if(data.result)
	               			{
	               			    
           						payorder();
                    		}
	              			 else
	               			{
	               	  			alert("您的个人用户信息不全，请先完善个人用户信息");
	                  			window.location.href="${path}/user/userInfoPage.htm";	
	               			}
	           			}
	        		});
             	}
            	function verify_zfmm()
            	{
            	       var zfmm =$('#zhifumima').val();
            	      $.ajax({
	            		cache: true,
	            		type: "POST",
	            		url:"${path}/user/verify_zfmm.json",
	           			dataType : 'json',
	           			 data:{zhifumima:zfmm},
	           			 async: false,
	            		success: function(data)
	            		{
	               			if(data.result)
	               			{
           						$('#modal-24').modal('hide');
           						verify_userinfo();
                    		}
	              			 else
	               			{
	               	  			for(var one in data.errors)
	                  			alert(data.errors[one]);	
	               			}
	           			}
	        		});
            	}
            	function goto_contract(id)
            	{
            	    $('#modal-25').modal('hide');
            	     window.location.href="${path}/web/order/addContent.do?orderNo="+orderNo+"&orderId="+id;
            	}
            </script>
            <!-- 页码 -->
            <center>
                 <c:forEach items="${page.pageView}" var="page">
		  			${page}
		  		</c:forEach>
            </center>           
        </div>
     </div>
</div>

<!-- 付款 -->
<div class="modal fade" id="modal-24">
    <div class="modal-dialog">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" data-dismiss="modal">×</a>   
               <h4><span>付款</span></h4>
           </div>
           <div class="modal-body text-center">
                <form action="#" method="post">
                    <div class="form-group mb50">
                        <div class="col-xs-12 fn">
                            <div class="input-group">
                                <span class="input-group-addon input-left">支付密码：</span>
                                <input type="password" id="zhifumima" class="form-control input-220">
                            </div>
                        </div>
                    </div>
                     <div class="form-group">
                        <div class="text-center">
                            <!--<button type="button" class="btn btn-s btn-120 b-close" data-toggle="modal" data-target="#modal-25" data-dismiss="modal" data-backdrop="static">提交</button>-->
                            <button type="button" class="btn btn-s btn-120 b-close" onclick="verify_zfmm()">提交</button>
                            <button type="button" class="btn btn-s btn-120 reset ml80 " data-dismiss="modal">取消</button>
                        </div>
                    </div>               
                </form>
           </div>
        </div>
    </div>
</div>
<!-- 支付成功 -->
<div class="modal fade" id="modal-25">
    <div class="modal-dialog modal-400">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" data-dismiss="modal">×</a>   
           </div>
           <div class="modal-body text-center">
                <span class="glyphicon glyphicon-ok ok"></span><br/>
                <p class="h4 mt20">支付成功！</p>
                <p class="f14 col9"><span id="show">5</span> 秒钟后自动跳转至合同签订页面</p>
                <p class="text-right margin0"><a onclick="goto_contract()" class="colC">直接跳转 >></a></p>
           </div>
        </div>
    </div>
</div>
<!-- 取消 -->
<div class="modal fade" id="modal-26">
    <div class="modal-dialog">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" data-dismiss="modal">×</a>   
           </div>
           <div class="modal-body text-center">
                <p class="f14 colR plr2 mb30">订单一旦取消将无法恢复，您需要重新定制，请您谨慎操作，如果确认取消订单，请点击下方的确认按钮，因取消订单产生的一切后果请您自身承担，感谢您对于本平台的支持！</p>
                <div class="form-group">
                    <div class="text-center">
                        <!--<button type="button" class="btn btn-s btn-120" data-toggle="modal" data-target="#modal-27" data-dismiss="modal" data-backdrop="static">确定</button>-->
                        <button type="button" class="btn btn-s btn-120" onclick="cancleOrder()">确定</button>
                        <button type="button" class="btn btn-s btn-120 reset ml80 " data-dismiss="modal">取消</button>
                    </div>
                </div> 
           </div>
        </div>
    </div>
</div>
<!-- 取消成功 -->
<div class="modal fade" id="modal-27">
    <div class="modal-dialog modal-400">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" data-dismiss="modal">×</a>   
           </div>
           <div class="modal-body text-center">
                <span class="glyphicon glyphicon-ok ok"></span><br/>
                <p class="h4 mtb20">订单取消成功！</p>
                <div class="form-group">
                    <div class="text-center">
                        <button type="button" class="btn btn-s btn-120" data-dismiss="modal">确定</button>
                    </div>
                </div> 
           </div>
        </div>
    </div>
</div>

<%@ include file="/jsp/foot_bus.jsp"%>
